import 'package:flutter/material.dart';
import 'package:flutter_widget_from_html/flutter_widget_from_html.dart';
import 'package:intl/intl.dart';
import 'package:kxy_flutter_app/model/course.dart';

class CourseDetailHeader extends StatefulWidget {
  final Course course;
  const CourseDetailHeader({Key key, @required this.course}) : super(key: key);

  @override
  State<StatefulWidget> createState() {
    return _CourseDetailHeaderState();
  }
}

class _CourseDetailHeaderState extends State<CourseDetailHeader> {
  bool showDetail = false;

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.symmetric(vertical: 15, horizontal: 15),
      color: Colors.white,
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            crossAxisAlignment: CrossAxisAlignment.end,
            children: [statusText, dateText],
          ),
          Padding(
            padding: EdgeInsets.only(top: 10),
            child: titleText,
          ),
          if (showDetail == true)
            Padding(
              padding: EdgeInsets.only(top: 10),
              child: detailText,
            ),
        ],
      ),
    );
  }

  Widget get statusRow {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      crossAxisAlignment: CrossAxisAlignment.end,
      children: [statusText, dateText],
    );
  }

  Widget get detailText {
    return HtmlWidget(
      widget.course.brief,
      config: HtmlWidgetConfig(
        textStyle: TextStyle(
          fontSize: 14,
        ),
      ),
    );
  }

  Widget get titleText {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      crossAxisAlignment: CrossAxisAlignment.end,
      children: [
        Expanded(
          child: Container(
            padding: EdgeInsets.only(right: 20),
            child: Text(
              widget.course.title,
              maxLines: 2,
              softWrap: true,
              overflow: TextOverflow.ellipsis,
              style: TextStyle(fontSize: 18, color: Colors.black87),
            ),
          ),
        ),
        GestureDetector(
          child: Padding(
            padding: EdgeInsets.only(bottom: 3),
            child: Text(
              showDetail ? '隐藏简介' : '显示简介',
              style: TextStyle(
                fontSize: 12,
                color: Colors.black54,
              ),
            ),
          ),
          onTap: () {
            setState(() {
              showDetail = !showDetail;
            });
          },
        ),
      ],
    );
  }

  Widget get dateText {
    var format = new DateFormat('yyyy-MM-dd');
    return Text(
      format.format(widget.course.updateTime) + '发布',
      style: TextStyle(
        color: Colors.black54,
        fontSize: 12,
      ),
    );
  }

  Widget get statusText {
    Color color;
    String text;
    var status = widget.course.status;
    if (status == CourseStatus.NotStarted) {
      color = Color.fromRGBO(255, 199, 110, 1);
      text = '未学习';
    }

    if (status == CourseStatus.Learning) {
      color = Color.fromRGBO(40, 196, 122, 1);
      text = '未完成';
    }

    if (status == CourseStatus.Completed) {
      color = Color.fromRGBO(63, 145, 252, 1);
      text = '已完成';
    }

    return Text(
      text,
      style: TextStyle(
        color: color,
        fontSize: 16,
      ),
    );
  }
}
